<script setup>
import {ref} from "vue";
import {useStore} from "vuex";
import {useRouter} from "vue-router";

// const emit = defineEmits(['myEvent'])
const store = useStore()
const router = useRouter();

const active = ref('friend');
const tabList = ref([
  {
    label: '好友',
    value: 'friend',
    icon: 'home-o',
    routePath: '/WeChatFriends\''
  },{
    label: '线索',
    value: 'clue',
    icon: 'search',
    routePath: '/Clue'
  },{
    label: '客户',
    value: 'client',
    icon: 'friends-o',
    routePath: '/Client'
  }
])

const handleTab = (val) => {
  let data = tabList.value.find(i => i.value === val)
  console.log(store.state);
  store.commit('set_tabData',data)
  router.push(data.routePath)
}

</script>

<template>
  <van-tabbar v-model="active" active-color="#EA5915" @change="handleTab">
    <van-tabbar-item :icon="item.icon" v-for="(item,index) in tabList" :key="index" :name="item.value">{{item.label}}</van-tabbar-item>
  </van-tabbar>
</template>

<style scoped lang="less">

</style>